<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="../css/font-awesome.css"/>
		<link rel="stylesheet" type="text/css" href="../css/gly.css" />
	</head>
	<body>
		<div class="tou">
			垃圾分类清理管理系统
			<div class="gly">
				欢迎管理员:&nbsp;&nbsp;&nbsp;&nbsp;
				<div class="mingzi" onclick="tuichu()">
					<div style="float: left;" th:text="${session.admin.nickname}"></div>
					<i class="fa fa-angle-down"></i>
					<br />
					<ol>
						<li><a href="/admin/zhuxiao" class="zhuxiao">注销账号</a></li>
						<li><a href="/admin/tuichu" class="zhuxiao">退出登录</a></li>
					</ol>
				</div>
			</div>
		</div>
		<div class="zuo">
			<div>
				<div class="lan" onclick="xiala(0)">
					<i class="fa fa-user-o">&nbsp;</i>
					业主管理
					<i class="fa fa-angle-down zhuan"></i>
				</div>
				<ul>
					<li><a href="/user/fenye" target="frame">查询业主信息</a></li>
					<li><a href="/user/yztj" target="frame">添加业主信息</a></li>
				</ul>
			</div>
			<div>
				<div class="lan" onclick="xiala(1)">
					<i class="fa fa-list">&nbsp;</i>
					物业管理
					<i class="fa fa-angle-down zhuan"></i>
				</div>
				<ul>
					<li><a href="/wuye/fenye" target="frame">查询物业信息</a></li>
					<li><a href="wytj.html" target="frame">添加物业信息</a></li>
				</ul>
			</div>
			<div>
				<div class="lan" onclick="xiala(2)">
					<i class="fa fa-list">&nbsp;</i>
					小区管理
					<i class="fa fa-angle-down zhuan"></i>
				</div>
				<ul>
					<li><a href="/xiaoqu/fenye" target="frame">查询小区信息</a></li>
					<li><a href="/xiaoqu/xqtj" target="frame">添加小区信息</a></li>
				</ul>
			</div>
			<div>
				<div class="lan" onclick="xiala(3)">
					<i class="fa fa-list">&nbsp;</i>
					投诉管理
					<i class="fa fa-angle-down zhuan"></i>
				</div>
				<ul>
					<li><a href="/compliant/fenye" target="frame">查看业主投诉</a></li>
				</ul>
			</div>
			<div>
				<div class="lan" onclick="xiala(4)">
					<i class="fa fa-list">&nbsp;</i>
					垃圾信息公告栏
					<i class="fa fa-angle-down zhuan"></i>
				</div>
				<ul>
					<li><a href="/tzgg/fenye" target="frame">查询公告信息</a></li>
					<li><a href="tzggtj.html" target="frame">发布公告信息</a></li>
				</ul>
			</div>
			<div>
				<div class="lan" onclick="xiala(5)">
					<i class="fa fa-list">&nbsp;</i>
					垃圾分类管理
					<i class="fa fa-angle-down zhuan"></i>
				</div>
				<ul>
					<li><a href="/laji/fenye" target="frame">查询垃圾分类信息</a></li>
					<li><a href="lajitj.html" target="frame">添加垃圾分类信息</a></li>
				</ul>
			</div>
			<div>
				<div class="lan" onclick="xiala(6)">
					<i class="fa fa-list">&nbsp;</i>
					垃圾站点管理
					<i class="fa fa-angle-down zhuan"></i>
				</div>
				<ul>
					<li><a href="/garbage/fenye" target="frame">查询垃圾站点信息</a></li>
					<li><a href="/garbage/garbagetj" target="frame">添加垃圾站点信息</a></li>
				</ul>
			</div>
			<div>
				<div class="lan" onclick="xiala(7)">
					<i class="fa fa-list">&nbsp;</i>
					垃圾清理信息管理
					<i class="fa fa-angle-down zhuan"></i>
				</div>
				<ul>
					<li><a href="/ljql/fenye" target="frame">查询垃圾清理信息</a></li>
					<li><a href="/ljql/ljqltj" target="frame">记录垃圾清理信息</a></li>
				</ul>
			</div>
			<div>
				<div class="lan" onclick="xiala(8)">
					<i class="fa fa-cog">&nbsp;</i>
					个人信息管理
					<i class="fa fa-angle-down zhuan"></i>
				</div>
				<ul>
					<li><a href="glyxx.html" target="frame">个人信息维护</a></li>
				</ul>
			</div>
		</div>
		
		<div class="you">
			<iframe src="/xiaoqu/fenye" name="frame" scrolling="no" id="k"></iframe>
		</div>
		<script type="text/javascript">
		function tuichu(){
				var z = document.getElementsByClassName("fa fa-angle-down");
				z[0].style.transform = "rotate(-180deg)";
				var ol = document.getElementsByTagName("ol");
				var li = ol[0].children;
				var li_height = li.length * 5 +"vh";
				if(ol[0].style.height == li_height){
					z[0].style.transform = "rotate(0deg)";
					ol[0].style.height = "0"
				}else{
					ol[0].style.height = li_height;
					for(var i=0;i<ol.length;i++){
						if(0 != i){
							z[i].style.transform = "rotate(0deg)";
							ol[i].style.height = "0";
						}
					}
				}
			}
			function xiala(s){
				var zhuan = document.getElementsByClassName("fa fa-angle-down zhuan");
				zhuan[s].style.transform = "rotate(-180deg)";
				var ul = document.getElementsByTagName("ul");
				var li = ul[s].children;//获取ul元素的所有元素子节点
				var li_height = li.length * 5 +"vh";//li总长度
				if(ul[s].style.height == li_height){
					zhuan[s].style.transform = "rotate(0deg)";
					ul[s].style.height = "0"
				}else{
					ul[s].style.height = li_height;
					for(var i=0;i<ul.length;i++){
						if(s != i){
							zhuan[i].style.transform = "rotate(0deg)";
							ul[i].style.height = "0";
						}
					}
				}
			}
		</script>
	</body>
</html>
